<template>
  <view>
    <view class="sticky">
      <v-tabs v-model="current" :scroll="false" :tabs="tabs" @change="changeTab" bgColor="#00000000"/>
    </view>
    <checkbox-group @change="checkChange">
      <view v-for="(item, index) in dataList" :key="index" class="box-item">

        <view class="title-lay">
          <checkbox v-if="edit" :value="item.id" style="transform:scale(0.7);margin-right: 20rpx"/>
          <view class="address">{{ item.area }}</view>
          <view class="time">{{ $wanlshop.timeFormat(item.createtime,'yyyy-mm-dd hh:MM:ss') }}</view>
        </view>
        <view class="content">
          <view>代理人: {{ item.contacts}}</view>
          <view>代理意向: {{ item.industry }}</view>
          <view>详细内容: {{ item.content }}</view>
        </view>
      </view>
    </checkbox-group>
    <uni-load-more :status="status" :content-text="contentText" />

    <view style="height: 200rpx"></view>
    <view v-if="!edit" class="btn-submit" @tap="$wanlshop.auth('/pages/distributors/addDistributors')">发布代理</view>
    <view v-if="edit" class="btn-submit" @tap="deleteItem">删除</view>
    <view class="btn-edit" @click="edit = !edit">{{ edit? "完成":"管理" }}</view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      current: 0,
      edit: false,
      checkArray:[],
      tabs: ['通过', '审核中'],
      search:{
        type:1,
        current_page: 1, //当前页码
      },
      dataList:[],
      status: 'loading',
      contentText: {
        contentdown: ' ',
        contentrefresh: '加载中',
        contentnomore: ''
      }
    };
  },
  onLoad() {
    this.getList()
  },
  onPullDownRefresh() {
    this.search.current_page = 1;
    this.getList()
  },
  onReachBottom() {
    //判断是否最后一页
    this.status = 'loading';
    this.getList();
  },
  methods: {
    changeTab(index) {
      this.search.type = index === 1 ? 0 : 1
      this.search.current_page = 1
      this.getList()
    },
    getList(){
      this.$api.get({
        url: '/wanlshop/invitation/myLists',
        data: this.search,
        success: res => {
          if (this.search.current_page === 1){
            this.dataList = res.data;
          }else {
            this.dataList = this.dataList.concat(res.data)
          }

          if (res.last_page === res.current_page) {
            this.status = 'noMore';
          } else {
            this.status = 'more';
            this.search.current_page++;
          }
        }
      });
    },
    deleteItem(){
      const _that = this
      if (this.checkArray.length === 0){
        this.$wanlshop.msg('请选择要删除的数据')
      }else{
        this.$api.post({
          url: '/wanlshop/invitation/delMyInvitation',
          data: {
            ids: this.checkArray.join(',')
          },
          success: res => {
            _that.$wanlshop.msg('删除成功')
            _that.checkArray = []
            _that.edit = false
            _that.search.current_page = 1
            _that.getList()
          }
        })
      }

    },
    checkChange(e){
      this.checkArray = e.detail.value
    }
  }
}
</script>

<style lang="scss">
.btn-submit{
  width: 700rpx;
  margin: 30rpx 25rpx;
  height: 80rpx;
  line-height: 80rpx;
  background: #ff9000;
  border-radius: 15rpx;
  color: white;
  text-align: center;
  position: fixed;
  bottom: 0;
  left: 0;
}
.btn-edit{
  height: 100rpx;
  line-height: 100rpx;
  width: 100rpx;
  border-radius: 50rpx;
  background: #ff9000;
  text-align: center;
  color: white;
  position: fixed;
  bottom: 140rpx;
  right: 40rpx;
}

.box-item{
  background: white;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
  margin: 22rpx;
  border-radius: 15rpx;
}
.box-item .title-lay{
  height: 80rpx;
  display: flex;
  padding: 0 20rpx;
  align-items: center;
  border-bottom: 1rpx solid #eee;
}
.box-item .title-lay .address{
  color: black;
  font-size: 30rpx;
  flex: 1;
}
.box-item .title-lay .time{
  color: black;
  font-size: 30rpx;
}
.link{
  color: #ff9000;
  margin-left: 10rpx;
}
.box-item .content{
  color: #666;
  font-size: 30rpx;
  line-height: 2;
  padding: 20rpx;
}
.sticky {
  position: -webkit-sticky; /* 兼容 Safari */
  position: sticky;
  top: 0;
  width: 100%;
  background-color: #f8f9fa;
  padding: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  z-index: 1000;
}
</style>
